﻿@{
    Layout = null;
    string prefixPath = "";
}
@using CJAtech.BBS.DataEntity;
@model CategoryInfo
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="format-detection" content="telephone=no,email=no">
    <title>近期活动</title>
    <!-- 基础css begin -->
    <link href="@prefixPath/Content/geely/css/base/reset.css" rel="stylesheet" />
    <link href="@prefixPath/Content/geely/css/base/base.css" rel="stylesheet" />
    <!-- 基础css end -->
    <!-- 组件依赖css begin -->
    <link href="@prefixPath/Content/geely/css/widget/button/button.default.css" rel="stylesheet" />
    <link href="@prefixPath/Content/geely/css/widget/button/button.css" rel="stylesheet" />
    <link href="@prefixPath/Content/geely/css/widget/modal/modal.css" rel="stylesheet" />
    <!-- 组件依赖css end -->
    <!-- 公用css begin -->
    <link href="@prefixPath/Content/geely/css/custom.css" rel="stylesheet" />
    <link href="@prefixPath/Content/geely/css/style.css" rel="stylesheet" />
    <link href="@prefixPath/Content/geely/css/theme.css" rel="stylesheet" />
    <link href="@prefixPath/Content/geely/iconfont/iconfont.css" rel="stylesheet" />
    <!-- 公用css end -->
    <style type="text/css">
        body {
            font-family: "Microsoft YaHei";
        }

        .padding-bottom-10 {
            padding-bottom: 10px;
        }

        .letter-spacing-1 {
            letter-spacing: 1px;
        }

        .content {
            padding: 10px 20px;
        }

        .padding-top-0 {
            padding-top: 0px !important;
        }

        a {
            text-decoration: none;
            color: white;
        }

            a:link {
                text-decoration: none;
                color: white;
            }

            a:visited {
                text-decoration: none;
                color: white;
            }

            a:hover {
                text-decoration: none;
                color: white;
            }

            a:active {
                text-decoration: none;
                color: white;
            }

        ul li {
            padding: 0 20px 10px 20px;
            letter-spacing: 1px;
        }

            ul li:first-child {
                padding: 10px 20px;
                letter-spacing: 1px;
            }
    </style>
</head>
<body id="article">
    @Html.Partial("Background")
    <div id="wrapper">
        @Html.Partial("Header")
        <div class="padding-left-20 padding-right-20">
            <ul id="articlelist"></ul>
            <button id="btnMore" class="button width-full margin-top-20">更多</button>
        </div>
    </div>
    <!-- 组件依赖js begin -->
    <script src="@prefixPath/Content/geely/js/dist/zepto.min.js"></script>
    <script src="@prefixPath/Content/geely/js/extend/fastclick.js"></script>
    <script src="@prefixPath/Content/geely/js/extend/compatibleIE9.js"></script>
    <script src="@prefixPath/Content/geely/js/extend/selector.js"></script>
    <script src="@prefixPath/Content/geely/js/widget/modal/modal.js"></script>
    <!-- 组件依赖js end -->
    <!-- 公用js begin -->
    <script src="@prefixPath/Content/geely/js/script.js"></script>
    <!-- 公用js begin -->
    <script type="text/javascript">
    //初始化变量
    var $articlelist = $("#articlelist");
    var $btnMore = $("#btnMore");
    var pageIndex = 1;
    $(function ($) {
        BindArticles(pageIndex, "@Model.CategoryId");
        $btnMore.on("click", function () {
            pageIndex++;
            BindArticles(pageIndex, "@Model.CategoryId");
        });
    })

    function BindArticles(pageIndex, categoryId) {
        var params;
        if (categoryId) {
            params = { pageIndex: pageIndex, categoryId: categoryId };
        } else {
            params = { pageIndex: pageIndex };
        }
        $.ajax({
            type: "GET",
            url: "@prefixPath/geely/getarticlelist",
                data: params,
                dataType: "json",
                success: function (invokeResult) {
                    if (invokeResult.ResultCode == "ArticleInfoNull") {
                        $btnMore.off("click");
                        $btnMore.hide();

                        return;
                    }
                    if (invokeResult.ResultCode == "Success") {
                        $.each(invokeResult.Data, function (i, item) {
                            $articlelist.append(CreateArticleHtml(item));
                        });
                        if (invokeResult.Data.length < 10) {
                            $btnMore.off("click");
                            $btnMore.hide();
                        }
                    }
                }
            });
        }
        function CreateArticleHtml(articleResult) {
            var result = "";
            if (!article) {
                return result;
            }
            return '<li class="letter-spacing-1">' +
                '<h3 class=" margin-top-20">' + articleResult.ArticleInfo.ArticleTitle + '</h3>' +
                '<div class="margin-top-10 padding-bottom-10">' +
                    '<div class="text-align-left inline-block">' +
                        '<span>' + JsonToDate(articleResult.ArticleInfo.CreateDate, false) + '</span>' +
                    '</div>' +
                    '<div class="float-right inline-block">' +
                        '<a href="@prefixPath/geely/activitydetail/' + articleResult.ArticleInfo.ArticleId + '">阅读全文<i class="icon-circle-arrow-right"></i> </a>' +
                    '</div>' +
                '</div>' +
                '<div class="header-line full"></div>' +
            '</li>';
        }

        //Json日期串后转成日期格式
        function JsonToDate(objJsonDate, isShowDetail) {
            var objDate = new Date(Number(objJsonDate.replace("/Date(", "").replace(")/", "")));
            if (typeof (isShowDetail) == "undefined") {
                isShowDetail = true;
            }
            return FormatDate(objDate, isShowDetail);
        }
        //日期格式化
        function FormatDate(objDate, isShowDetail) {
            var objYear = objDate.getFullYear();
            var objMonth = objDate.getMonth();
            objMonth = objMonth + 1 < 10 ? "0" + (objMonth + 1) : objMonth + 1;
            var objDay = objDate.getDate();
            objDay = objDay < 10 ? "0" + objDay : objDay;
            if (typeof (isShowDetail) == "undefined") {
                isShowDetail = true;
            }
            if (isShowDetail) {
                var objHour = objDate.getHours();
                objHour = objHour < 10 ? "0" + objHour : objHour;
                var objMinute = objDate.getMinutes();
                objMinute = objMinute < 10 ? "0" + objMinute : objMinute;
                var objSecond = objDate.getSeconds();
                objSecond = objSecond < 10 ? "0" + objSecond : objSecond;
                return objYear + "-" + objMonth + "-" + objDay + " " + objHour + ":" + objMinute + ":" + objSecond;
            }
            return objYear + "-" + objMonth + "-" + objDay;
        }
    </script>
</body>
</html>